<!--房产列表展示项内容组件-->
<template>
    <div class="property-inner">
        <div class="image">
            <span v-show="data.special" class="label">特色</span>
            <span v-show="data.hot" class="label">热门</span>
            <a :href="jumpUrl"><img :src="data.pictureUrl" alt=""></a>
            <ul class="property-feature">
                <li>
                    <span class="area"><img src="/images/icons/area.png" alt="">{{data.square}}平米</span>
                </li>
                <li>
                    <span class="bed"><img src="/images/icons/bed.png" alt="">{{data.roomNumber}}</span>
                </li>
                <li>
                    <span class="bath"><img src="/images/icons/bath.png" alt="">{{data.bathroomNumber}}</span>
                </li>
                <li>
                    <span class="parking"><img src="/images/icons/parking.png" alt="">{{data.garageNumber}}</span>
                </li>
            </ul>
        </div>
        <div class="content">
            <div class="left">
                <h3 class="title"><a :href="jumpUrl">{{data.title}}</a></h3>
                <span class="location"><img src="/images/icons/marker.png" alt="">{{data.address}}</span>
            </div>
            <div class="right">
                <div class="type-wrap">
                    <span class="price">￥{{data.price}}<span v-if="data.rentType===1">{{leaseTypeVal[data.leaseType]}}</span></span>
                    <span class="type" v-show="data.rentType===2">出售</span>
                    <span class="type" v-show="data.rentType===1">出租</span>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                jumpUrl: '/property-detail',
                leaseTypeVal: ['', '天', '周', '月', '季', '年']
            }
        },
        props: {
            data: {
                type: Object,
                require: true,
                default() {
                    return {
                        id: 1,
                        pictureUrl: '/images/property/property-1.jpg',
                        square: 550,
                        roomNumber: 3,
                        bathroomNumber: 3,
                        garageNumber: 3,
                        title: '江南宅院',
                        price: 550,
                        leaseType: 1,
                        address: '锦江区东大街下东大街568号',
                        rentType: 1,
                        hot: 0,
                        special: 0,
                    }
                }
            }
        }
    }
</script>
